import Vue from 'vue'
import Vuex from 'vuex'
import types from './mutation-type'
Vue.use(Vuex)

const moduleA = {
  state: {
    counter: 100,
    name: 'moduleA'
  },
  actions: {
    changeModuleACounter() {
      // console.log(arguments); // 第一个参数是上下文
      // console.log(arguments[0].getters === arguments[0].rootGetters);
      // console.log('arguments');
    }
  },
  mutations: {
    changeModuleACounter(state, paylaod) {
      state.counter = paylaod.counter
      console.log('hello');
    }
  },
  getters: {
    counterDouble(state, getters) {
      // console.log(arguments);
      console.log(getters.studentsMoreThan35);
      return state.counter * 2
    }
  }
}
const moduleB = {
  state: {
    counter: 200,
    name: 'moduleB'
  }
}
const store = new Vuex.Store({
  state: {
    counter: 0,
    students: [{
        name: 'cuifan',
        age: 15
      },
      {
        name: 'cuifan1',
        age: 89
      },
      {
        name: 'cuifan2',
        age: 65
      },
      {
        name: 'cuifan3',
        age: 28
      },
      {
        name: 'cuifan4',
        age: 37
      },
    ],
    info: {
      name: 'cuifan'
    }
  },
  actions: {
    testStateSyncByActions(context, payload) {
      return new Promise((resolve, reject) => {
        setTimeout(function() {
          context.commit('testStateSyncByActions', payload)
          resolve()
        }, 2000)
      })
    },
    changeModuleACounter() {
      console.log(2);
    }
  },
  mutations: {
    counterAdd(state, n) {
      state.counter += n
    },
    counterSub(state) {
      state.counter--
    },
    sendParams(state, payload) {
      console.log(payload);
    },
    mutationCommit(state, payload) {
      console.log(payload);
    },
    [types.UPDATE_INFO](state, payload) {
      // 没有加入到响应式系统中
      // state.info['count'] = payload.count
      // console.log(state.info);
      // 加入到响应式系统
      // 1.使用vue.set()
      // Vue.set(state.info, 'count', payload.count)
      // console.log(state.info);
      // 2.使用新对象给旧对象赋值
      state.info = {
        ...state.info,
        'count': payload.count
      }
    },
    testStateSync(state, payload) {
      setTimeout(function() {
        state.info = {
          ...state.info,
          message: payload.message
        }
      }, 3000)
    },
    testStateSyncByActions(state, payload) {
      state.info = {
        ...state.info,
        message: payload.message
      }
    },
    changeModuleACounter() {
      console.log('hello world');
    }
  },
  getters: {
    studentsMoreThan35(state) {
      return state.students.filter(student => student.age > 35)
    },
    studentsMoreThan35Count(state, getters) {
      return getters.studentsMoreThan35.length
    },
    // getters不能传递参数，如果想要从getters中根据id获取对应的信息，怎么办？
    studentsMoreThan35ByAge(state, getters) {
      return (age) => getters.studentsMoreThan35.find(student => student.age === age)
    },
    // counterDouble() {
    //   return 1
    // }
  },
  modules: {
    a: moduleA,
    b: moduleB
  }
})

export default store